import React, { useEffect, useState } from 'react';
import { notification, Button, Form, Input} from 'antd';
import { add_list, table_list } from '../../../utils/Booking Management/api'
import { LeftOutlined } from '@ant-design/icons';
import '../../../styles/Booking Management/addlist.scss'
import { useNavigate } from 'react-router-dom';

interface Props {}
function Addlist(props: Props) {

    let navigate = useNavigate()
    // const { TextArea } = Input;
    let [data, setdata] = useState([])
    useEffect(() => {
        table_list().then(({ data }) => {
            setdata(data)
        })
    }, [])
    const onFinish = (values: any) => {
        console.log(values);
        add_list(values).then((res) => {
            notification.success({ message: '添加成功！' });
        })
    }

    // 点击返回跳路由
    let tostaffcenter = () => {
        navigate('/index/bookingmanagement/registration')
    }

    return (
        <div className='addstaff'>
            <div className='backbox' onClick={tostaffcenter}>
                <LeftOutlined />
                返回
            </div>
            <Form
                name="basic"
                labelCol={{ span: 6 }}
                wrapperCol={{ span: 16 }}
                onFinish={onFinish}
            >
                <Form.Item
                    label="患者姓名"
                    name="name"
                    rules={[{ required: true, message: '请输入姓名' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="就诊卡号"
                    name="jnumber"
                    rules={[{ required: true, message: '请输入就诊卡号!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="身份证号"
                    name="snumber"
                    rules={[{ required: true, message: '请输入身份证号!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="手机号"
                    name="phone"
                    rules={[{ required: true, message: '请输入手机号!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="挂号科室"
                    name="ghks"
                    rules={[{ required: true, message: '请选择科室!' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="挂号类型"
                    name="active"
                    rules={[{ required: true, message: '请选择挂号类型!' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="挂号费"
                    name="money"
                    rules={[{ required: true, message: '请输入挂号费!' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="挂号状态"
                    name="over"
                    rules={[{ required: true, message: '请选择状态!' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item
                    label="挂号时间"
                    name="jday"
                    rules={[{ required: true, message: '请选择时间!' }]}
                >
                    <Input />
                </Form.Item>
                <Form.Item label="序列号" name="key">
                    <Input placeholder='请输入序列号' />
                </Form.Item>
                <Form.Item wrapperCol={{ offset: 10, span: 10 }}>
                    <Button type="primary" htmlType="submit">
                        添加
                    </Button>
                </Form.Item>
            </Form>
        </div>
    )
}

export default Addlist